<template>
	<view class="page flex-col">

		<view class=" ">
			<view class='searchGood'>
				<view class="dis navBtnWrap">
					<view class="navBtn-left" @click="chooseLocation">
						选择地址
					</view>
					<view class="navBtn-right dis">
						<view class='search acea-row row-between-wrapper'>
							<view class='input acea-row row-between-wrapper'>
								<text class='iconfont icon-sousuo2'></text>
								<input type='text' :value='searchValue' :focus="focus" placeholder='点击搜索商品'
									placeholder-class='placeholder' @input="setValue"></input>
								<image style="width: 30rpx;height: 30rpx;margin-left: 10rpx;" @click="cleanKeyWord"
									src="@/static/com/icon_close.png" mode=""></image>
							</view>
							<view class='bnt' @tap='searchBut'>搜索</view>
						</view>
					</view>

				</view>
			</view>


			<view class="list_1 flex-col">
				<view class="list-items_1 flex-col" v-for="(item, index) in loopData0" :key="index">
					<view class="text-wrapper_3 flex-row">
						<text class="text_7">{{item.lanhutext0}}</text>
					</view>
					<view class="box_6 flex-row">
						<view class="box_7 flex-col">
							<view class="image-text_2 flex-row justify-between">

								<image class="label_2" src="@/static/pagesA/icon_yysj.png" mode=""></image>
								<!-- <image
                  class="label_2"
                  referrerpolicy="no-referrer"
                  :src="item.lanhuimage0"
                /> -->
								<text class="text-group_2">{{item.lanhutext1}}</text>
							</view>
							<view class="group_5 flex-row justify-between">
								<image class="label_2" src="@/static/pagesA/icon_dw.png" mode=""></image>

								<text class="text_8">{{item.lanhutext2}}</text>
							</view>
							<text class="text_9">{{item.lanhutext3}}</text>
						</view>
						<view class="image-text_3 flex-col justify-between" @click="openLocation">
							<image class="image_2" src="@/static/pagesA/icon_dh.png" mode=""></image>
							<text class="text-group_3">地图</text>
						</view>
						<view class="image-text_3 flex-col justify-between" @click="call">
							<image class="image_2" src="@/static/pagesA/icon_dt.png" mode=""></image>

							<text class="text-group_3">电话</text>
						</view>
					</view>

				</view>
			</view>

		</view>



	</view>
</template>
<script>
	export default {
		data() {
			return {
				loopData0: [{
						lanhutext0: '湖滨天街店',
						lanhuimage0: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG735113be8eb3f24c1831c5f2855240c8.png',
						lanhutext1: '营业时间:08:00-20:00',
						lanhuimage1: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG1bd4b3a7759a6d3f55ad8debfb7710cd.png',
						lanhutext2: '地址:大阪府大阪市中央区心某某街道129号',
						lanhutext3: '距您12.79km',
						lanhuimage2: 'https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/b22d784263ee408a8281c112c6b9d8a8_mergeImage.png',
						lanhutext4: '地图',
						lanhuimage3: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNGebd4f698da8dc520fe69ac8bc26b61a2.png',
						lanhutext5: '电话',
						lanhuimage4: 'https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/1c7dcbb0327e4d31a6f212ba3a60973f_mergeImage.png',
					},
					{
						lanhutext0: '龙翔桥店',
						lanhuimage0: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG735113be8eb3f24c1831c5f2855240c8.png',
						lanhutext1: '营业时间:08:00-20:00',
						lanhuimage1: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG1bd4b3a7759a6d3f55ad8debfb7710cd.png',
						lanhutext2: '地址:大阪府大阪市中央区心某某街道129号',
						lanhutext3: '距您12.79km',
						lanhuimage2: 'https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/dd9a70aeaca043f2863ce562fbc0cc2f_mergeImage.png',
						lanhutext4: '地图',
						lanhuimage3: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNGebd4f698da8dc520fe69ac8bc26b61a2.png',
						lanhutext5: '电话',
						lanhuimage4: 'https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/7db1df1d7ada4147aa357b41c78346ba_mergeImage.png',
					},
					{
						lanhutext0: '西溪门店',
						lanhuimage0: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG735113be8eb3f24c1831c5f2855240c8.png',
						lanhutext1: '营业时间:08:00-20:00',
						lanhuimage1: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG1bd4b3a7759a6d3f55ad8debfb7710cd.png',
						lanhutext2: '地址:大阪府大阪市中央区心某某街道129号',
						lanhutext3: '距您12.79km',
						lanhuimage2: 'https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/3cf077e39d014b2299c0d97d5ae16c5f_mergeImage.png',
						lanhutext4: '地图',
						lanhuimage3: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNGebd4f698da8dc520fe69ac8bc26b61a2.png',
						lanhutext5: '电话',
						lanhuimage4: 'https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/8f018160a5834a07ba8c6cc185ecce72_mergeImage.png',
					},
					{
						lanhutext0: '龙翔桥店',
						lanhuimage0: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG735113be8eb3f24c1831c5f2855240c8.png',
						lanhutext1: '营业时间:08:00-20:00',
						lanhuimage1: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNG1bd4b3a7759a6d3f55ad8debfb7710cd.png',
						lanhutext2: '地址:大阪府大阪市中央区心某某街道129号',
						lanhutext3: '距您12.79km',
						lanhuimage2: 'https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/241e24547db24d579cee40db9e4831f9_mergeImage.png',
						lanhutext4: '地图',
						lanhuimage3: 'https://lanhu.oss-cn-beijing.aliyuncs.com/MasterDDSSlicePNGebd4f698da8dc520fe69ac8bc26b61a2.png',
						lanhutext5: '电话',
						lanhuimage4: 'https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/e7d5c9a6ab9f4a31a1b0ade936a60684_mergeImage.png',
					},
				],
				constants: {},
			};
		},
		methods: {
			call() {
				uni.makePhoneCall({
					phoneNumber: '114' //仅为示例
				});
			},
			openLocation() {
				uni.openLocation({
					latitude: 30.18534, // 目标纬度
					longitude: 120.26457, // 目标经度
					name: '目标位置',
					address: '目标位置的地址',
					success: function() {
						console.log('打开地图导航成功');
					},
					fail: function(err) {
						console.log('打开地图导航失败', err);
					}
				});
			},
			chooseLocation() {
				uni.chooseLocation({
					success: function(res) {
						console.log(res, 'sdd ')
						console.log('位置名称：' + res.name);
						console.log('详细地址：' + res.address);
						console.log('纬度：' + res.latitude);
						console.log('经度：' + res.longitude);
					},
					fail(err) {
						console.log(err, 'ddddd')
					}
				});
			},
		},
	};
</script>
<style lang="scss" scoped>
	@import 'com/selfPickUpSite.css';
	@import '@/com/css/common.css';

	.searchGood .search {

		background-color: #fff !important;
	}

	.searchGood .search {}

	.searchGood .search .input {
		// width: 598rpx;
		background-color: #f7f7f7;
		border-radius: 33rpx;

		box-sizing: border-box;
		height: 66rpx;
		padding: 0px 10rpx;
	}

	.searchGood .search .input input {
		align-items: center;
		font-size: 26rpx;
		margin-right: 10rpx;
	}

	.searchGood .search .input .placeholder {
		color: #bbb;
	}

	.searchGood .search .input .iconfont {
		color: #000;
		font-size: 35rpx;
	}

	.searchGood .search .bnt {
		width: 120rpx;
		text-align: center;
		height: 66rpx;
		line-height: 66rpx;
		font-size: 24rpx;
		margin-right: 6px;
		color: #fff;
		background: $maincolor;
		border-radius: 30px 30px 30px 30px;
		opacity: 1;

	}

	.searchGood .title {
		font-size: 28rpx;
		color: #999;
		margin: 50rpx 30rpx 25rpx 30rpx;
		justify-content: space-between;
		align-items: center;

		image {
			width: 40rpx;
			height: 40rpx;
		}
	}

	.searchGood .list {
		padding-left: 10rpx;
	}

	.searchGood .list .item {
		font-size: 26rpx;
		color: #454545;
		padding: 0 21rpx;
		/* height: 60rpx; */
		border-radius: 30rpx;
		/* line-height: 60rpx; */

		margin: 0 0 20rpx 20rpx;
		padding: 8rpx 37rpx;
		background: #F1F1F1;
	}

	.searchGood .line {
		border-bottom: 1rpx solid #eee;
		margin: 20rpx 30rpx 0 30rpx;
	}

	.navBtnWrap {
		align-items: center;
		padding: 30rpx 15rpx;
		margin: 20rpx auto;
		background: #fff;

		.navBtn-left {
			width: 25%;
		}

		.navBtn-right {
			width: 75%;

			justify-content: space-between;
		}
	}
</style>